<template>
    <div class="sidebar">
        <div class="li" v-for="(item, index) in sidebarList" :key="index">
            <router-link :to="item['path']" v-if="permission.indexOf(item['mid']) != -1">
                {{item['name']}}
            </router-link>
        </div>
    </div>
</template>
<script>
/*
*   author: iissoftware
*   description: 侧边栏组件   
*/
import sideBarMenu from '../menu/sideBarMenu'
export default {
    data() {
        return {
            permission: this.$store.state.permission,       //用户权限
            sidebarList: sideBarMenu
        }
    },
}
</script>
<style scoped>
    .sidebar {
        float: left;
        overflow: hidden;
        background-color: #34485b;
        width: 140px;
        height: 100%;
    }
    .sidebar .li > a {
        color: #fff;
        display: block;
        text-align: center;
        height: 56px;
        line-height: 56px;
    }
    .sidebar .li > a:hover, .sidebar .li > a.router-link-exact-active {
        background-color: #e34e42;
    }
    .sidebar .li:first-child > a {margin-top: 30px;}
</style>